<head>
  <meta charset="UTF-8">
</head>
<div class="block">
   <span class="id">序号</span>
   <span class="span">图书编号</span>
   <span class="span">图书名称</span>
   <span class="span">图书数量</span>
   <ul class="books">
     <li *ngFor="let book of books"
       [class.selected]="book === selectedBook"
        (click)="onSelect(book)">
       <span class="badge">{{book.id}}</span>
       <span class="span">{{book.bid}}</span>
       <span class="span1">{{book.bname}}</span>
       <span class="span">{{book.number}}</span>
     </li>
   </ul>
   <app-book-details [book]="selectedBook"></app-book-details>
 </div>
 <div class="blockSearch">
   <div class="book_id">
     <input placeholder="图书编号" [(ngModel)]="bid" class="input"/>
   </div>
   <div class="imput">
     <input placeholder="图书名称" [(ngModel)]="bname" class="input"/>
   </div>
   <div class="imput">
     <input placeholder="图书数量" [(ngModel)]="number" class="input"/>
   </div>
   <button (click)="onSubmit()">查 找</button>
   <button (click)="toBorrow()">借 阅</button>
 </div>
 <div class="tip">
  {{tip}}
</div>
